import useRipple from './hooks/useRipple'
import { DEFAULT_PLUGIN_OPTIONS, IRippleOptionWithBinding, IRippleOptions } from './ripple-types'

const optionMap = new WeakMap<HTMLElement, Partial<IRippleOptions> | false>()
const globalOptions = { ...DEFAULT_PLUGIN_OPTIONS }
export default {
  mounted(el: HTMLElement, binding: any) {
    el.addEventListener('pointerdown', (event) => {
      const options = optionMap.get(el)
      // 必须确保disabled 属性存在 否则指令终止报错
      if (binding.value && binding.value.disabled) {
        return
      }

      if (options === false) {
        return
      }

      useRipple(event, el, {
        ...globalOptions,
        ...options
      })
    })
  },
  updated(el: HTMLElement, binding: IRippleOptionWithBinding): void {
    optionMap.set(el, binding.value ?? {})
  }
}
